<template>
  <div class="min-height: 500px">
    <div class="flex flex-justify-between w-1200px m-auto pt-56px pb-71px">
      <Online />
      <Knowledge />
    </div>

    <div class="bg-#eee pt-44px pb-50px">
      <ContentHeader headerTitle="热门课程" en="POPULAR  COURSES">
        <Hot />
      </ContentHeader>
    </div>
  </div>
</template>

<script setup lang="ts">
import { reactive } from "vue";
import Hot from "./components/hot.vue";
import Online from "./components/Online.vue";
import Knowledge from "./components/knowledge.vue";
</script>
<style scoped lang="scss"></style>
